<template>
    <el-dialog title="添加凭证" :visible="visible" append-to-body :destroy-on-close="true" @close="close">
        <el-form size="small" :model="ruleForm" label-width="100px" ref="ruleForm">
            <el-form-item label="确认送达凭证" prop="qs_food">
                <upload-single-img :imgUrl="ruleForm.qs_proof" @removeImg="removeImg" @handleSuccess="handleSuccess"
                    ref="upload"></upload-single-img>
            </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button @click="close" size="small">取 消</el-button>
            <el-button type="primary" size="small" @click="onSubmit" :disabled="isDisabled" :loading="isLoading">确
                定</el-button>
        </span>
    </el-dialog>
</template>

<script>
import UploadSingleImg from "@/components/uploadSingleImg.vue";
import { confirmRecieved } from '../../../api/order';
export default {
    name: 'driverProof',
    components: {
        UploadSingleImg,
    },
    data() {
        return {
            visible: false,
            isDisabled: false,
            isLoading: false,
            ruleForm: {
                qs_proof: '', // 送达凭证
                id: ''
            }
        }
    },
    methods: {
        add() {
            this.visible = true
        },
        onSubmit() {
            if (this.ruleForm.qs_proof == '') {
                this.$message.error('请上传确认送达凭证')
                return
            }
            this.isDisabled = true;
            this.isLoading = true;
            const params = {
                supply_order_id: this.ruleForm.id,
                voucher: this.ruleForm.qs_proof
            }
            confirmRecieved(params).then(res => {
                if (res.code == 0) {
                    this.$message.success(res.msg)
                    // 通知父组件拉最新数据
                    this.$emit('reload')
                } else {
                    this.$message.error(res.msg)
                }
                this.isDisabled = false;
                this.isLoading = false;
                this.visible = false
            })
        },
        handleSuccess(e) {
            this.ruleForm.qs_proof = e
        },
        removeImg() {
            this.ruleForm.qs_proof = ''
        },
        close() {
            this.visible = false;
        },
    }
}
</script>
<style scoped></style>